<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <title>湖南省自来水公司营销管理信息系统</title>

    <link rel="stylesheet" href="../css/reset.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/text.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/form.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/buttons.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/grid.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/layout.css" type="text/css" media="screen" title="no title"/>

    <link rel="stylesheet" href="../css/ui-darkness/jquery-ui-1.8.12.custom.css" type="text/css" media="screen"
          title="no title"/>
    <link rel="stylesheet" href="../css/plugin/jquery.visualize.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/plugin/facebox.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/plugin/uniform.default.css" type="text/css" media="screen" title="no title"/>
    <link rel="stylesheet" href="../css/plugin/dataTables.css" type="text/css" media="screen" title="no title"/>

    <link rel="stylesheet" href="../css/custom.css" type="text/css" media="screen" title="no title">
    <style type="text/css">
        table.data th {
            text-align: center !important;
        }

        table.data tbody tr td {
            vertical-align: middle;
            text-align: center;
        }

        td.content {
            text-align: left !important;
            vertical-align: top !important;
        }

        table.forminfo {
            width: 100%;
        }

        table.forminfo td {
            text-align: left;
            vertical-align: top !important;
            margin: 0px !important;
            padding: 0px !important;
        }

        table.forminfo textarea {
            width: 100%;
            height: 80px;
        }

        table.forminfo button {
            margin: 0px !important;
        }
    </style>
    <script type="text/javascript">
        //进入修改附加信息界面
        function editTag(tagID){
           /* $('#btnAddTag').hide();
            $('#btnEditTag').show();
            $('#btnCancelTag').show();
            if(tagID == 34)
                $('#txtTag').val('此户以前新开发区明景楼盘二期工程的遗留户，各部门请注意勘察现场');
            else if(tagID == 93)
                $('#txtTag').val('请稽查部门密切跟进此用户');

            $('#txtTag').focus();*/
        }

        //保存修改附加信息
        function saveEditTag() {
            newTag();
        }

        //放弃修改附加信息
        /*function cancelEditTag() {
            newTag();
        }*/

        //回到新增附加信息界面
        function newTag() {
            $('#btnEditTag').hide();
            $('#btnCancelTag').hide();
            $('#btnAddTag').show();
            $('#txtTag').val('');
        }
    </script>
</head>

<body>

<div id="wrapper">


    <div id="header">

        <div class="content_pad">
            <h1><a href="../workspace.html">湖南省自来水公司营销管理信息系统</a></h1>

            <ul id="nav">

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-wrench"></span>业扩工程</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/be__request.html">01 用户申请</a></li>
                            <li><a href="../page/be__audit.html">02 初步审核</a></li>
                            <li><a href="../page/be__pay.html">03 交施工费</a></li>
                            <li><a href="../page/be__billclear.html">04 水费清算</a></li>
                            <li><a href="../page/be__contract.html">05 供水协议</a></li>
                            <li><a href="../page/be__working.html">06 施工竣工</a></li>
                            <li><a href="../page/be__open.html">07 通水停水</a></li>
                            <li><a href="../page/be__save.html">08 档案存档</a></li>
                            <li><a href="../page/be_order.html">工单管理</a></li>
                            <li><a href="../page/be_abort.html">终止工单</a></li>
                            <li><a href="../page/be_reportProgress.html">业扩工程进度</a></li>
                            <li><a href="../page/be_reportMoney.html">业扩收费报表</a></li>
                        </ul>

                    </div>
                </li>

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-person"></span>用户管理</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/user_search.html">用户查询</a></li>
                            <li><a href="../page/user_add.html">快捷新户</a></li>
                            <li><a href="../page/user_changeName.html">快捷过户</a></li>
                            <li><a href="../page/user_changeBank.html">快捷代扣</a></li>
                            <li><a href="../page/user_changeMeter.html">快捷换表</a></li>
                            <li><a href="../page/user_changeFormula.html">快捷重签</a></li>
                            <li><a href="../page/user_delete.html">快捷销户</a></li>
                            <li><a href="../page/user_reportShortcut.html">快捷操作记录</a></li>
                            <li><a href="../page/user_docNum.html">档案号管理</a></li>
                            <li><a href="../page/user_sendMsg.html">短信群发</a></li>
                        </ul>

                    </div>
                </li>

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-pencil"></span>抄表管理</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/rd_volume.html">表册管理</a></li>
                            <li><a href="../page/rd_init.html">抄表初始化</a></li>
                            <li><a href="../page/rd_task.html">任务分配</a></li>
                            <li><a href="../page/rd_enter.html">抄表录入</a></li>
                            <li><a href="../page/rd_audit.html">抄表审核</a></li>
                            <li><a href="../page/rd_reportReading.html">抄表情况查询</a></li>
                            <li><a href="../page/rd_reportVolumeReading.html">抄表统计报表</a></li>
                            <li><a href="../page/rd_reportZero.html">零吨位用户查询</a></li>
                            <li><a href="../page/rd_reportMaxValue.html">最大码值修正记录</a></li>
                            <li><a href="../page/rd_reportCPreAmount.html">底码修正记录</a></li>
                            <li><a href="../page/rd_reportMeterCheck.html">水表周检报表</a></li>
                        </ul>

                    </div>
                </li>

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-star"></span>收费管理</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/pay_window.html">窗口收费</a></li>
                            <li><a href="../page/pay_batch.html">批量收费</a></li>
                            <li><a href="../page/pay_invoiceReprint.html">发票补开/作废</a></li>
                            <li><a href="../page/pay_reportDebts.html">欠费报表</a></li>
                            <li><a href="../page/pay_reportPay.html">收费情况报表</a></li>
                            <li><a href="../page/pay_reportMonthRecycle.html">月资金回收情况报表</a></li>
                            <li><a href="../page/pay_reportBalance.html">用户预收情况报表</a></li>
                            <li><a href="../page/pay_reportWaterType.html">各类用水统计总表</a></li>
                        </ul>

                    </div>
                </li>

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-script"></span>发票管理</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/inv_invoiceManage.html">发票总表</a></li>
                            <li><a href="../page/inv_invoiceIn.html">发票入库</a></li>
                            <li><a href="../page/inv_invoiceOut.html">发票出库</a></li>
                            <li><a href="../page/inv_invoiceArchive.html">发票交票</a></li>
                            <li><a href="../page/inv_invoiceReportOut.html">发票出库情况查询</a></li>
                            <li><a href="../page/inv_invoiceReportEmp.html">收费人员发票查询</a></li>
                            <li><a href="../page/inv_invoiceReportArchive.html">发票交票情况查询</a></li>
                            <li><a href="../page/inv_invoiceReportUse.html">发票使用情况查询</a></li>
                            <li><a href="../page/inv_invoiceReportMoneySum.html">销账汇总报表</a></li>
                            <li><a href="../page/inv_invoiceReportMoneyDetail.html">销账明细报表</a></li>
                        </ul>
                    </div>
                </li>

                <li class="nav_dropdown nav_icon">
                    <a href="javascript:;"><span class="ui-icon ui-icon-gear"></span>系统设置</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../page/sys_area.html">抄表辖区</a></li>
                            <li><a href="../page/sys_meterType.html">水表型号</a></li>
                            <li><a href="../page/sys_dept.html">部门管理</a></li>
                            <li><a href="../page/sys_emp.html">员工管理</a></li>
                            <li><a href="../page/sys_menupower.html">菜单权限设置</a></li>
                            <li><a href="../page/sys_areapower.html">辖区权限设置</a></li>
                            <li><a href="../page/sys_waterType.html">用水类型设定</a></li>
                            <li><a href="../page/sys_surcharge.html">附加费设定</a></li>
                            <li><a href="../page/sys_flow.html">流程配置</a></li>
                        </ul>

                    </div>
                </li>

                <li class="nav_current nav_dropdown nav_icon_only">
                    <a href="javascript:;">&nbsp;</a>

                    <div class="nav_menu">
                        <ul>
                            <li><a href="../workspace.html">我的工作台</a></li>
                            <li><a href="../page/sys_pwd.html">修改密码</a></li>
                            <li><a href="/autoWater/logout">退出系统</a></li>
                        </ul>
                    </div> <!-- .menu -->
                </li>
            </ul>
        </div> <!-- .content_pad -->

    </div> <!-- #header -->

    <div id="masthead">
        <div>
            <span id="pagetitle"><a href="javascript:;">工单信息</a></span>
            <span id="welcome_span">欢迎回来，{{username.empName}}</span>
        </div>
    </div> <!-- #masthead -->

    <div id="content" class="xgrid">


        <div class="x12">

            <h2>工单信息 {{order.orderNo}} 新户 {{order.userName}} </h2>

            <div class="tab_container">
                <ul class="tabs">
                    <li><a href="#tab1" >流程记录</a></li>
                    <li><a href="#tab2" >基本信息</a></li>
                    <li><a href="#tab3" >用户详细表</a></li>
                    <li><a href="#tab4" >表计详细表</a></li>
                    <li><a href="#tab5" >其它信息</a></li>
                    <li><a href="#tab6" >交费信息</a></li>
                </ul>
                <div class="tab_content_container">
                    <div id="tab1" class="tab_content">
                        <!-- 流程记录 -->
                        <table width="100%">
                            <tbody>
                            <tr>
                                <td width="48%">
                                    <!-- 历史记录 -->
                                    流程历史记录
                                    <table class="data display">
                                        <thead>
                                        <tr>
                                            <th width="20"></th>
                                            <th width="100">处理时间</th>
                                            <th>内容</th>
                                            <th width="100">操作人</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr v-for="history,i in BeHistory" :key="history.id"
                                            :class="i % 2 === 0 ? 'even' : 'odd'">
                                            <td>{{ i +1}}</td>
                                            <td>{{ formattedDate(history.datee) }}</td>
                                            <td v-if="i !== BeHistory.length - 1">{{ stepDescription(history.stepID) }}</td>
                                            <td v-if="i === BeHistory.length - 1">{{ stepDescription(history.stepID).replace('[完成]', '[当前]') }}</td>
                                            <td>{{ history.syEmp.empName }}</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                    <!-- 历史记录结束 -->
                                </td>
                                <td width="2%"></td>
                                <td width="50%">
                                    <!-- 附加信息 -->
                                    附加信息记录
                                    <table class="data display">
                                        <thead>
                                        <tr>
                                            <th width="100"></th>
                                            <th>内容</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr v-for="(item, index) in BeComment" :key="index" :class="{ odd: index % 2 === 0, even: index % 2 !== 0 }">
                                            <td>
                                                <b>{{item.syEmp.empName}}</b>
                                                {{ formattedDate(item.datee) }}<br/>
                                                <div v-if="username.id==item.empID">
                                                    <a href="javascript:;" @click="up(item)">改</a>
                                                    <a href="javascript:;" @click="del(item.id)">删</a>
                                                </div>
                                                <br />
                                            </td>
                                            <td class="content">{{ item.comment }}</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                    <div style="float:left;"><textarea id="txtTag"
                                                                       style="width:330px;height:80px;" v-model="bec.comment"></textarea>
                                    </div>
                                    <div>
                                        <button
                                                id="btnAddTag" style="height:94px;width:100px;" @click="addComment">添加附加信息
                                        </button>
                                        <button
                                                id="btnEditTag" style="height:47px;width:100px;display:none;"
                                                @click="update">保存修改
                                        </button>
                                        <button
                                                id="btnCancelTag" style="height:47px;width:100px;display:none;"
                                                onClick="cancelEditTag();">放弃修改
                                        </button>
                                    </div>

                                    <!-- 附加信息结束 -->
                                </td>
                            </tr>
                            </tbody>
                        </table>
                        <!-- 流程记录结束 -->
                    </div>
                    <div id="tab2" class="tab_content">

                        <!-- 基本信息 -->
                        <table width="100%">
                            <thead>
                            <tr>
                                <th width="60"></th>
                                <th width="220"></th>
                                <th width="60"></th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>用户名称</td>
                                <td><input type="text" readonly="readonly" v-model="order.userName"/></td>
                                <td>用户类型</td>
                                <td><input type="text" readonly="readonly" v-model="order.userType"/></td>
                            </tr>
                            <tr>
                                <td>联系人</td>
                                <td><input type="text" readonly="readonly" v-model="order.linkMan"/></td>
                                <td>联系电话</td>
                                <td><input type="text" readonly="readonly" v-model="order.phone"/></td>
                            </tr>
                            <tr>
                                <td>用户地址</td>
                                <td colspan="3"><input type="text" size="68" readonly="readonly" v-model="order.address"/></td>
                            </tr>
                            <tr>
                                <td>用水量</td>
                                <td><input type="text" readonly="readonly" v-model="order.maxAmount"/></td>
                                <td>申请表径</td>
                                <td><input type="text" readonly="readonly" v-model="meterTypeName"/></td>
                            </tr>
                            <tr>
                                <td>房屋层次</td>
                                <td><input type="text" readonly="readonly" v-model="order.houseHeight"/></td>
                                <td>接水用途</td>
                                <td><input type="text" readonly="readonly" v-model="order.useTarget"/></td>
                            </tr>
                            <tr>
                                <td>备注说明</td>
                                <td colspan="3"><input type="text" size="68" readonly="readonly" v-model="order.userRemark"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>收费方式</td>
                                <td><input type="text" readonly="readonly" v-model="order.payType"/></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>开户银行</td>
                                <td><input type="text" readonly="readonly" v-model="order.bankCompany"/></td>
                                <td>银行账号</td>
                                <td><input type="text" readonly="readonly" v-model="order.bankNum"/></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>原户编码</td>
                                <td><input type="text" readonly="readonly" v-model="order.oldUserNo"/></td>
                                <td>原户姓名</td>
                                <td><input type="text" readonly="readonly" v-model="order.oldUserName"/></td>
                            </tr>
                            <tr>
                                <td>原户电话</td>
                                <td><input type="text" readonly="readonly" v-model="order.oldUserPhone"/></td>
                                <td>原户表径</td>
                                <td><input type="text" readonly="readonly" v-model="order.oldMeter"/></td>
                            </tr>
                            <tr>
                                <td>原户地址</td>
                                <td colspan="3"><input type="text" size="68" readonly="readonly" v-model="order.oldUserAddr"/></td>
                            </tr>
                            </tbody>
                        </table>
                        <!-- 基本信息 -->

                    </div>
                    <div id="tab3" class="tab_content">
                        <!-- 用户详细表 -->
                        <table class="data display">
                            <thead>
                            <tr>
                                <th width="30">序号</th>
                                <th width="80">姓名</th>
                                <th width="80">电话</th>
                                <th width="80">短信号码</th>
                                <th>地址</th>
                                <th width="80">合同编号</th>
                                <th width="80">档案号</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr  v-for="user,index in BeOrderUser" :class="index % 2 === 0 ? 'even' : 'odd'">
                                <td>{{ index+1 }}</td>
                                <td>{{ user.userName }}</td>
                                <td>{{ user.phone }}</td>
                                <td>{{ user.smsphone }}</td>
                                <td>{{ user.address }}</td>
                                <td>{{ user.contractNum }}</td>
                                <td>{{ user.docNum }}</td>
                            </tr>
                            </tbody>
                        </table>
                        <!-- 用户详细表 -->
                    </div>
                    <div id="tab4" class="tab_content">
                        <!-- 表计详细表 -->
                        <table class="data display">
                            <thead>
                            <tr>
                                <th width="30">序号</th>
                                <th width="80">姓名</th>
                                <th width="80">表径</th>
                                <th width="80">表身码</th>
                                <th width="80">最大表码值</th>
                                <th width="80">起始码</th>
                                <th width="100">水表厂家</th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(user, index) in BeOrderUser" :key="index" :class="[index % 2 == 0 ? 'even' : 'odd']">
                                <td>{{ index + 1 }}</td>
                                <td>{{ user.userName }}</td>
                                <td>{{ meterTypeName }}</td>
                                <td>{{ user.meterName }}</td>
                                <td>{{ user.maxValues }}</td>
                                <td>{{ user.startValue }}</td>
                                <td>{{ user.meterFactory }}</td>
                                <td></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div id="tab5" class="tab_content">
                        <!-- 其它信息 -->
                        <table width="100%">
                            <thead>
                            <tr>
                                <th width="60"></th>
                                <th width="220"></th>
                                <th width="60"></th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>建单日期</td>
                                <td><input readonly="readonly" v-model="order.createDate" /></td>
                                <td>关单日期</td>
                                <td><input readonly="readonly" v-model="order.completeDate" /></td>
                            </tr>
                            <tr>
                                <td>开工日期</td>
                                <td><input readonly="readonly" v-model="order.projectDate1" /></td>
                                <td>竣工日期</td>
                                <td><input readonly="readonly" v-model="order.projectDate2" /></td>
                            </tr>
                            <tr>
                                <td>审核人</td>
                                <td><input type="text" readonly="readonly" v-model="gnll"/></td>
                            </tr>
                            <tr>
                                <td style="vertical-align:top;">审核意见</td>
                                <td colspan="3">
                                    <textarea readonly="readonly" style="width:426px;height:150px;" v-model="order.auditMessage"></textarea>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                        <!-- 其它信息 -->
                    </div>
                    <div id="tab6" class="tab_content">
                        <!-- 交费信息 -->
                        <table width="100%">
                            <thead>
                            <tr>
                                <th width="60"></th>
                                <th width="220"></th>
                                <th width="60"></th>
                                <th width="220"></th>
                                <th width="60"></th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>总应收</td>
                                <td><input readonly="readonly" class="right" v-model="order.projectMoney"/> 元</td>
                                <td>总实收</td>
                                <td><input readonly="readonly" class="right" v-model="order.realMoney"/> 元</td>
                                <td>总欠缴</td>
                                <td><input readonly="readonly" class="right" :value="order.projectMoney-order.realMoney"/> 元</td>
                            </tr>
                            </tbody>
                        </table>
                        <table class="data display">
                            <thead>
                            <tr>
                                <th width="30">序号</th>
                                <th width="80">姓名</th>
                                <th width="80">应交金额</th>
                                <th width="80">实收金额</th>
                                <th width="80">发票号</th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(item, index) in BeOrderUser" :class="[index % 2 === 0 ? 'even' : 'odd']">
                                <td>{{ index + 1 }}</td>
                                <td>{{ item.userName }}</td>
                                <td>{{ item.projectMoney }}</td>
                                <td>{{ item.realMoney }}</td>
                                <td>{{ item.invoiceNo }}</td>
                                <td></td>
                            </tr>
                            </tbody>
                        </table>
                        <!-- 交费信息 -->
                    </div>
                </div>
            </div>

        </div> <!-- .x12 -->

    </div> <!-- #content -->

    <div id="footer">
        <div class="content_pad">
            <p>&copy; 2013-11 版权所有 <a href="#">湖南省自来水公司</a>. 技术支持 <a href="#">职业教育</a>.</p>
        </div> <!-- .content_pad -->
    </div> <!-- #footer -->

</div> <!-- #wrapper -->

<script src="../js/jquery/jquery-1.5.2.min.js"></script>
<script src="../js/jquery/jquery-ui-1.8.12.custom.min.js"></script>
<script src="../js/misc/excanvas.min.js"></script>
<script src="../js/jquery/facebox.js"></script>
<script src="../js/jquery/jquery.visualize.js"></script>
<script src="../js/jquery/jquery.dataTables.min.js"></script>
<script src="../js/jquery/jquery.tablesorter.min.js"></script>
<script src="../js/jquery/jquery.uniform.min.js"></script>
<script src="../js/jquery/jquery.placeholder.min.js"></script>

<script src="../js/widgets.js"></script>
<script src="../js/dashboard.js"></script>
<script src="../js/axios.js"></script>
<script src="../js/vue3.js"></script>

<script type="text/javascript">
    const app = Vue.createApp({
        data() {
            return {
                username: JSON.parse(sessionStorage.getItem("user")), //登录的用户
                order: {
                    syMetertype:{meterTypeName:'N50'}
                },//工单对象
                BeHistory: '',//流程历史
                BeComment:[],//工单附加信息
                bec:{},//附加信息（修改）
                BeOrderUser: [],//工单用户
                gnll:"",//审核人
            }
        },
        computed: {
            stepDescription() {
                return (stepID) => {
                    switch (stepID) {
                        case 1:
                            return '[完成]用户申请';
                        case 2:
                            return '[完成]初步审核';
                        case 3:
                            return '[完成]交施工费';
                        case 4:
                            return '[完成]水费清算';
                        case 5:
                            return '[完成]供水协议';
                        case 6:
                            return '[完成]施工竣工';
                        case 7:
                            return '[完成]通水停水';
                        case 8:
                            return '[完成]档案存档';
                        default:
                            return '';
                    }
                };
            },
            currentStepDescription() {
                return (stepID) => {
                    const stepDesc = this.stepDescription(stepID);
                    return stepDesc ? stepDesc.replace('[完成]', '[当前]') : '';
                };
            },
            //时间
            formattedDate() {
                return (date) => {
                    var options = {}
                    if (date !== "") {
                        options = {
                            year: 'numeric',
                            month: '2-digit',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit',
                            second: '2-digit'
                        };
                        return new Date(date).toLocaleString('zh-CN', options);
                    }
                    return "";
                };
            },
            meterTypeName() {
                return this.order.syMetertype.meterTypeName;
            },
        },
        mounted() {
            this.csh();
        },

        methods: {
            //流程记录
            csh() {
                Dashboard.init();
                //选项卡初始化
                $('.tab_container').tabs();
                //获取order对象
                const urlParams = new URLSearchParams(window.location.search);
                const order = urlParams.get('order');
                //获取工单信息
                this.getOrderById(order);
                //获取流程历史记录
                this.getHistory(order);
                //获取附加信息
                this.getComment(order);
                this.getOrderUser(order);
            },
            //获取用户详情
            getOrderUser(id){
                axios.get("/beOrderUser?orderNo="+id).then((res)=>{
                    if (res.data.code === 503) {
                        alert("用户:"+res.data.errorMessage);
                    } else {
                        this.BeOrderUser = res.data.data;
                    }
                })
            },
            //根据id获取工单
            getOrderById(orderString){
                axios.get("/beOrder/getById?orderNo="+orderString).then((res)=>{
                    if (res.data.code === 503) {
                        alert("工单:"+res.data.errorMessage);
                    } else {
                        this.order = res.data.data;
                        this.hhh(this.order.auditEmpID)
                    }
                })
            },
            //获取审核人
            hhh(id){
                axios.get("/syEmp?id="+id).then((res)=>{
                    this.gnll=res.data.data.empName;
                });
            },
            //获取流程
            getHistory(oid){
                axios.get("/beOrder/history?oid=" + oid).then((res) => {
                    if (res.data.code === 503) {
                        alert("流程:"+res.data.errorMessage);
                    } else {
                        this.BeHistory = res.data.data;
                        var b = {
                        };
                        b.stepID = parseInt(this.BeHistory[this.BeHistory.length - 1].stepID) + 1;
                        b.syEmp=parseInt(this.BeHistory[this.BeHistory.length - 1].syEmp) ;
                        b.syEmp.empName="";
                        b.datee="";
                        this.BeHistory.push(b);
                        console.log(this.BeHistory);
                    }
                })
            },
            //获取附加信息
            getComment(oid){
                axios.get("/beComment?orderNo="+oid).then((res)=>{
                    if (res.data.code === 503) {
                        alert(res.data.errorMessage);
                    } else {
                        this.BeComment = res.data.data;
                    }
                })
            },
            //附加信息->改->弹窗
            up(item){
                $('#btnAddTag').hide();
                $('#btnEditTag').show();
                $('#btnCancelTag').show();
                $('#txtTag').focus();
                this.bec=item;
            },
            //附加信息->修改->保存修改
            update(){
                axios.put("/beComment",this.bec).then((res)=>{
                    if (res.data.code === 503) {
                        alert(res.data.errorMessage);
                    } else {
                        alert(res.data.data);
                        newTag();
                        this.bec={};
                        this.getComment();
                    }
                })
            },
            //附加信息->删
            del(id){
                if(confirm("是否删除")){
                    axios.delete("/beComment?id="+id).then((res)=>{
                        if (res.data.code === 503) {
                            alert(res.data.errorMessage);
                        } else {
                            alert(res.data.data);
                            this.bec={}
                            this.getComment();
                        }
                    })
                }
            },
            //附加信息->添加
            addComment(){
                this.bec.orderNo=this.order.orderNo;
                this.bec.empID=this.username.id;
                axios.post("/beComment",this.bec).then((res)=>{
                    if (res.data.code === 503) {
                        alert(res.data.errorMessage);
                    } else {
                        alert(res.data.data);
                        this.getComment();
                    }
                })
            }
        }
    });
    app.mount('#wrapper');
</script>
</body>

</html>
